<%-- 
    Document   : index
    Created on : Dec 15, 2014, 3:43:54 PM
    Author     : Tran Thuy Duong
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Handmade</title>
	<link rel="stylesheet" type="text/css" href="css/style.css"/>
	<link rel="stylesheet" type="text/css" href="css/navigation.css"/>
	<link rel="stylesheet" type="text/css" href="css/center_content.css"/>
	<link rel="stylesheet" type="text/css" href="css/footer.css"/>
	<link rel="stylesheet" type="text/css" href="css/menu_tab.css"/>
	<link rel="stylesheet" type="text/css" href="css/showslides.css"/>
	
	<script type="text/javascript" src="js/showslides.js"></script> 

	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
	<script type="text/javascript" src="js/tooltip.js"></script>
        <script>
        function loadAccount(user)
        {
        var xmlhttp;
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("center_content").innerHTML=xmlhttp.responseText;
            }
          }
        xmlhttp.open("GET","C_Customer?btAction=Account&tendn=" + user,true);
        xmlhttp.send();
        }
        
          function loadRegister(location)
        {
        window.location=location;
        }
         
        </script>
</head>

<body>
<div class="main">
	<div class="bg_topmenu">
		<div id="TopMenu">
							
			<ul>
			
				<li class="First topMenu_Account">
					<a onclick="loadAccount('${sessionScope.USER}');">
						Tài khoản của tôi
					</a>
				</li>
				<li class="topMenu_Order">
					<a href="#">
						Quản lý đơn hàng
					</a>
				</li>
				<li class="topMenu_Wishlist">
					<a href="#">
						Danh sách ưa thích
					</a>
				</li>
				<li class="CartLink topMenu_Cart">
					<a href="#">
						Giỏ hàng
						<span id="pInTop"></span>
					</a>
				</li>
				
				
				
                                <li class="topMenu_Account" id="topMenu_Account" >
					<a href="home.jsp">
						Xin chào ${sessionScope.USER} [Thoát]
					</a>
				</li>
				
			</ul>

		</div>
	</div>

	
	<div id="Header">
	</div>
	
		
	<!--Begin Menu tab-->
		
			<div id="menu_tab">
				<div class = "left_menu_content"></div>
				<ul class="menu">
					<li><a href="#" id="nav_home"><span>Trang chủ</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_introduce"><span>Giới thiệu</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_product"><span>Sản phẩm</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_news"><span>Tin tức</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_contact"><span>Liên hệ</span></a></li>
					<li class = "divider"></li>
					<li><a href="#" id="nav_map"><span>Bản đồ</span></a></li>	
					<li class = "divider"></li>				
				</ul>
				<div id="search_form">
					<input name="" type="text" id="" class="search_input" onkeydown="return keyDownHandler">
					<input name="" type="submit" id="" class="search_button" value onclick="OnSearchClick()">
				</div>		
		
		</div>
		<!--End Menu tab-->
	
	<!-- Content: Start -->
	<div id="Wrapper">
	
		<!-- Navigation: Start -->
		<div class="navigation">
			Navigation: <span class="current"> Home </span>
		</div>
		<!-- Navigation: End -->
		
		
		<!-- Left: Start -->
		<div id="PaneLeft">
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>SẢN PHẨM</p>
				</div>
					
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a href="#">
								<p>HANDMADE LÀM ĐẸP<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a href="#">
								<p>HANDMADE CUỘC SỐNG<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a href="#">
								<p>BẾP HANDMADE<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a href="#">
								<p>QUÀ TẶNG HANDMADE<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_istar"></div>
						<div class="product_name">
							<a href="#">
								<p>NGUYÊN LIỆU HANDMADE<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="footer">
				</div>
			</div>
				
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>TÌM THEO GIÁ</p>
				</div>
					
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a href="#">
								<p>DƯỚI 30 NGHÌN<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a href="#">
								<p>TỪ 30-50 NGHÌN<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a href="#">
								<p>TỪ 50-100 NGHÌN<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a href="#">
								<p>TỪ 100-200 NGHÌN<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="content">
					<div class="product">
						<div class="product_iprice"></div>
						<div class="product_name">
							<a href="#">
								<p>TRÊN 200 NGHÌN<p>
							</a>
						</div>
					</div>
				</div>
				
				<div class="footer">
				</div>
			</div>
				
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>HỖ TRỢ</p>
				</div>
					
				<div class="content">
					<div class="product">
						<div class="product_ihelp"></div>
						<div class="product_name">							
							<p>Tư vấn hỗ trợ:<p>	
							<ul>
								<p>Số điện thoại: 0123xxxxxxxx</p>
								<p>Email:</p>
								<a href="#">
									<p>handmadettd@gmail.com</p>
								</a>								
							</ul>													
						</div>
					</div>					
				</div>	
				
				<div class="footer">
				</div>
			</div>
			
			<div id="PaneLeft_1">
				<div id="PaneLeft_header">
					<p>LƯỢT TRUY CẬP</p>
				</div>
					
				<div class="content">
					<div class="product">						
							<p>Đang trục tuyến: </p>
							<p>Hôm qua: </p>	
							<p>Hôm nay: </p>	
							<p>Tất cả: </p>						
					</div>					
				</div>	
				
				<div class="footer">
				</div>
			</div>				
		</div>
		<!-- Left: End -->
		
		<!-- Center: Start -->
			<div class="center_content" id="center_content">
			
				
				<div id="container">
					<img id="img" src="images/slide_1.jpg"/>
		
					<div ><img class="left" onClick="slider(-1)" src="images/back_button_1.png" /></div>
					<div ><img class="right" onClick="slider(1)" src="images/next_button_1.png" /></div>
	
				</div>
				
				
				<div class="center_main">
				<!-- New Product ------------------>
				<div class="pro_new">
					
						<div class="center_title_bar">
							SẢN PHẨM MỚI
						</div>
						
						<!-- Product ----------->
						<div class="pro_box">
							
							<div class="center_pro_box">
								<div class="pro_image">
									<a href="#" class="tip_trigger"><img src="images/pro_7_DREAMCATCHER NHO DO - XANH LA.jpg" height="125px" width="100px" border="1px"/>
										<span class="tip" ><img src="images/pro_7_DREAMCATCHER NHO DO - XANH LA.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
									</a>
								</div>
								<div class="pro_title"><a href="#">Dreamcapcher</a>
								</div>
								<div class="pro_price">
									<span class="price">75.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_1.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_1.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Thiệp Noen</a>
								</div>
								<div class="pro_price">
									<span class="price">35.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_3.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_3.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Lọ điều ước</a>
								</div>
								<div class="pro_price">
									<span class="price">30.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
					
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_8_THO MAT TRO.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_8_THO MAT TRO.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Thỏ mắt trố</a>
								</div>
								<div class="pro_price">
									<span class="price">65.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
						
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_5.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_5.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Vòng tay</a>
								</div>
								<div class="pro_price">
									<span class="price">40.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
						
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_9.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_9.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Nhẫn</a>
								</div>
								<div class="pro_price">
									<span class="price">55.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
						
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_10.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_10.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Tất Noen</a>
								</div>
								<div class="pro_price">
									<span >50.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_11.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_11.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Hoa vải</a>
								</div>
								<div class="pro_price">
									<span >110.000 <font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
				</div>
				
				<!-- Product Promotion----------->
				
						<div class="center_title_bar">
							SẢN PHẨM KHUYẾN MÃI
						</div>
						<!-- Product ---------->
						<div class="pro_box">
							
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_19.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_19.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Người tuyết</a>
								</div>
								<div class="pro_price">
									<span class="reduce">125.000</span>
									<span >110.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
						
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_12.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_12.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Túi vải</a>
								</div>
								<div class="pro_price">
									<span class="reduce">200.000</span>
									<span >180.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
						
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_13.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_13.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Lợn đầu to</a>
								</div>
								<div class="pro_price">
									<span class="reduce">50.000</span>
									<span >45.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_14.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_14.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Vòng mixed</a>
								</div>
								<div class="pro_price">
									<span class="reduce">50.000</span>
									<span >40.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_15.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_15.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Dreamcapcher</a>
								</div>
								<div class="pro_price">
									<span class="reduce">150.000</span>
									<span >140.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_16.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_16.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Gối mèo</a>
								</div>
								<div class="pro_price">
									<span class="reduce">150.000</span>
									<span >140.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_17.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_17.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Vòng Mixed cam</a>
								</div>
								<div class="pro_price">
									<span class="reduce">55.000</span>
									<span >45.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
						
						<div class="pro_box">
							<div class="center_pro_box">
								<div class="pro_image">
								<a href="#" class="tip_trigger"><img src="images/pro_18.jpg" height="125px" width="100px" border="1px"/>
									<span class="tip" ><img src="images/pro_18.jpg"  style="float: left;" alt="" height="250px" width="200px" /></span>
								</a>
								</div>
								<div class="pro_title"><a href="#">Người tuyết</a>
								</div>
								<div class="pro_price">
									<span class="reduce">80.000</span>
									<span >70.000<font class="vnd">đ</font></span>
								</div>
							</div>
							<div class="bottom_pro_box">
								<a href="#"><img src="images/muahang.gif" height="20px"/></a>
							</div>
						</div >
				
				</div>
				
			</div>
		<!-- Center: End -->

		<!-- Right: Start -->
		<div id="PaneRight">
			<div id="PaneRight_1">
				<div id="PaneRight_header">
					<p>GIỎ HÀNG</p>
				</div>
				<div class="content">
					<p>Chưa có sản phẩm nào trong giỏ hàng của bạn!<p>
				</div>
				<div class="footer">
				</div>
			</div>
			
			<div id="PaneRight_1">
				<div id="PaneRight_header">
						<p>SẢN PHẨM BÁN CHẠY</p>
				</div>
				<div class="content">
					<div class="product">
						<div class="product_number">1</div>
						<div class="product_name"><a href="#"><p>THỎ BÔNG<p></a></div>
						<div class="product_price"><p>80.000đ<p></div>
					</div>
					
					<div class="product">
						<div class="product_number">2</div>
						<div class="product_name"><a href="#"><p>VÒNG MIXED CÁ TÍNH<p></a></div>
						<div class="product_price"><p>50.000đ<p></div>
					</div>
					
					<div class="product">
						<div class="product_number">3</div>
						<div class="product_name"><a href="#"><p>HOA VẢI YÊU THƯƠNG<p></a></div>
						<div class="product_price"><p>110.000đ<p></div>
					</div>
				</div>
				<div class="footer">
				</div>
			</div>
			
			<div id="PaneRight_1">
				<div id="PaneRight_header">
						<p>TIN TỨC</p>
				</div>
				<div class="content">
					<div class="new">
						<div class="new_image"><a href="#"><img src="images/anh1-305x175.jpg" height="45" width="60"></a></div>
						<div class="new_title"><a href="#"><p>Đồ handmade – Trao gửi yêu thương<p></a></div>
					</div>
					
					<div class="new">
						<div class="new_image"><a href="#"><img src="images/qua.jpg" height="45" width="60"></a></div>
						<div class="new_title"><a href="#"><p>Học cách làm nơ cho hộp quà 20-11 thêm rực rỡ nhé!<p></a></div>
					</div>
					
					<div class="new">
						<div class="new_image"><a href="#"><img src="images/hop-qua-lang-man-ngay-8-3.jpg" height="45" width="60"></a></div>
						<div class="new_title"><a href="#"><p>Làm hộp quà siêu lãng mạn thay lời tỏ tình tặng nàng ngày 8 – 3<p></a></div>
					</div>
					
					<div class="new">
						<div class="new_image"><a href="#"><img src="images/WT-015WHI-XL-2-305x175.jpg" height="45" width="60"></a></div>
						<div class="new_title"><a href="#"><p>Len Handmade, cô bạn thân mùa đông.<p></a></div>
					</div>
					
					<div class="new">
						<div class="new_image"><a href="#"><img src="images/a1-305x175.jpg" height="45" width="60"></a></div>
						<div class="new_title"><a href="#"><p>Các cách gọt, tỉa hoa quả vừa nhanh, đẹp và độc đáo...<p></a></div>
					</div>
					
				</div>
				<div class="footer">
				</div>
			</div>
		
		</div>
		<!-- Right: End -->
		
		<div class="footer_final">
				
						<div id="footer-info">
							<ul class="column1">
								<li><span>Thủ tục</span></li>
								
								<li href="#">Đăng kí thành viên</li>
								<li href="#">Kích hoạt tài khoản đăng tin</li>
								<li href="#">Đăng ký gian hàng miễn phí</li>
								<li href="#">Đăng tin hỏi đáp</li>
								<li href="#">Muốn bán sản phẩm</li>
								<li href="#">Liên hệ hỗ trợ về sản phẩm</li>
							</ul>
							<ul class="column2">
								<li><span>Bảo vệ người tiêu dùng</span></li>
								<li href="#">Bảo hiểm</li>
								<li href="#">An ninh giao dịch</li>
								<li href="#">Người mới đăng ký</li>
								<li href="#">Phản hồi người tiêu dùng</li>
								<li href="#">Trợ giúp trực tuyến 24h</li>
							</ul>
							<ul class="column3">
								<li><span>Thanh toán</span></li>
								<li href="#">Phương thức thanh toán</li>
								<li href="#">Thiết lập tài khoản thanh toán</li>
								<li href="#">Mua hàng không cần tài khoản</li>
								<li href="#">Thanh toán an toàn</li>
								<li href="#">Nạp tiền tài khoản</li>
								
							</ul>
							
						</div>
					
		</div>
		
		
	</div>
	<!-- Content: End -->
	
	
	
	
</div>

	  
</body>
</html>

